<%--
  Created by IntelliJ IDEA.
  User: asus
  Date: 2018/2/1
  Time: 19:57
  To change this template use File | Settings | File Templates.
--%>
<%@page pageEncoding="UTF-8" %>
<!doctype html>
<html lang="zh-cmn">
<head>
    <%@include file="/WEB-INF/jsp/comm/head.jsp"%>
</head>
<body>

<div class="container">
    <div style="margin-bottom: 15px;" class="col-md-offset-11">
        <button type="button" class="btn btn-primary" onclick="add()"><i class="glyphicon glyphicon-plus-sign"></i>添加角色</button>
    </div>
    <table id="roleTb"
           data-toggle="table"
           data-url=${ctx}"/sys/role/search"
    >
        <thead>
        <tr>
            <th data-field="id">角色编号</th>
            <th data-field="roleName">角色名称</th>
            <th data-field="lastUpdateTime">最后修改时间</th>
            <th data-field="createdBy">创建人</th>
            <th data-field="isStart" data-formatter="forStart">状态（启用/未启用）</th>
            <th data-events="events" data-formatter="fmtOpt">操作</th>
        </tr>
        </thead>
    </table>
</div>

<div id="add">
    <form class="form-inline">
        <div class="row" style="margin-left: 10px;">
            <label for="" class="control-label">角色名称：</label>
            <input type="text" name="roleName" class="form-control"><span style=" color: red; font-size: 12px; margin-left: 10px;"></span>
        </div>
    </form>
</div>

<%@include file="/WEB-INF/jsp/comm/foot.jsp"%>
<script>
    function forStart(value,row){
        return value==1?"<input type='checkbox' name='isStart' checked=checked />":"<input type='checkbox' name='isStart'/>";
    }
    function fmtOpt(value,row){
        var del='<button class="btn btn-default del">删除</button>';
        return del;
    }
    var events={
        "click .del":function(e,value,row){
            del(row);
        }
    };

    function del(row){
        $.post(ctx+"sys/role/delRole",{roleId:row["id"]},function(msg){
            toastr.warning("信息提示",msg);
            $("#roleTb").bootstrapTable("refresh");
        });
    }
    function add(){
        $("#add form")[0].reset();
        $("#add form span").html('');
        $("#add").dialog("open");
    }
    $(function(){
        $("#add").dialog({
            title:"添加角色",
            btnName:"确定",
            btnBind:function () {
                var param=$("#add form").serialize();
                $.post(ctx+"sys/role/addRole",param,function (msg) {
                    toastr.warning(msg);
                    $("#add").dialog("close");
                    $("#roleTb").bootstrapTable("refresh");
                },'text')
            }
         });
    })
    $("[name=roleName]").change(function(){
        var param=$("#add form").serialize();
        $.post(ctx+"sys/role/getName",param,function(msg){
            $("span").html(msg);
        })
    })
</script>
</body>
</html>
